<!DOCTYPE html>
<html lang="en-us">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>$title</title>
  <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script>
      function UnityProgress(gameInstance, progress) {
          if (!gameInstance.Module)
              return;
          document.getElementById('myprogress').style.width = (100 * progress) + "%";
          window.pprog = 100*progress;
          if (progress == 1) {
              document.getElementById('myprog').style.display = "none";
              // var confme ="{\"actionsound\": \"http://localhost:88/mp3/buttonInterface.wav\",\n" +
              //     "\"opensound\": \"http://localhost:88/mp3/buttonInterface.wav\",\n" +
              //     "\"id\": 1,\n" +
              //     "\"checkUrl\": \"http://localhost:88/newvr/check\",\n" +
              //     "\"events\": {\n" +
              //     "\"btnOK\": \"[291,291]\",\n" +
              //     "\"btnLeft\": \"[282,282]\",\n" +
              //     "\"left\": \"[106,106]\",\n" +
              //     "\"back\": \"[285,285]\",\n" +
              //     "\"right\": \"[108,108]\",\n" +
              //     "\"up\": \"[105,105]\",\n" +
              //     "\"front\": \"[284,284]\",\n" +
              //     "\"down\": \"[107,107]\",\n" +
              //     "\"btnRight\": \"[283,283]\"\n" +
              //     "},\n" +
              //     "\"clicksound\": \"http://localhost:88/mp3/buttonInterface.wav\"\n" +
              //     "}";
              var confme ="";
              var confmeObj = $SendMessageParam;
              confme = JSON.stringify(confmeObj);
              gameInstance.SendMessage("UI", "RecieveString", confme);
              console.log("11111111111111111 " + confme);
              document.addEventListener('keydown', function (e) {
                  if (e.key === 'MediaPlayPause'){
                      gameInstance.SendMessage("UI", "RecieveOk");
                      console.log("2222222222222222222 ");
                  }
              });
          }
      }
  </script>
  <script src="$UnityLoader"></script>
  <script>
      var gameInstance = UnityLoader.instantiate("gameContainer", "$webvrJson", {onProgress: UnityProgress});
  </script>
</head>
<body>
<body  class="template" id="mybody" style="margin:0px;overflow:hidden">
<div id="gameContainer"></div>
<div id="myprog" style="background: #000;width: 100%;height: 100%;position: absolute;top: 0;">
  <div style="text-align: center;position: absolute;top: 50%;left: 50%;margin-top: -110px;margin-left: -250px;">
    <img src="https://cuihao.oss-cn-beijing.aliyuncs.com/vr/js/tsDataLogo.png">
    <div id="myprogresscons" class="progress"
         style="width:500px;border: 2px solid #337ab7;background: none;border-radius: 8px;box-shadow: 0 0 15px #337ab7;margin: 6px 0;">
      <div id="myprogress" class="progress-bar"></div>
    </div>
  </div>
</div>
<script type='text/javascript'>
    var w = window.innerWidth;
    var h = window.innerHeight;
    var gameContainer = document.getElementById('gameContainer');
    gameContainer.style.width = w + 'px';
    gameContainer.style.height = h + 'px';
    window.onresize = function() {
        // console.info(screen.availHeight);
        // var body = document.getElementById('mybody');
        var w = window.innerWidth;
        var h = window.innerHeight;
        var gameContainer = document.getElementById('gameContainer');
        gameContainer.style.width = w + 'px';
        gameContainer.style.height = h + 'px';
        var canv = document.getElementById('#canvas');
        canv.width = w;
        canv.height = h;
    };
</script>
</body>
</body>
</html>